<template>
  <div class="topNav">
    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"
      background-color="#545c64" text-color="#fff" active-text-color="#ffd04b">
      <el-menu-item index="1" @click="goHome">首页</el-menu-item>
      <el-menu-item index="2" @click="goNotice">公告信息</el-menu-item>
      <el-menu-item index="3" @click="goInformation">招聘资讯</el-menu-item>
      <el-menu-item index="4" @click="search">查找职位</el-menu-item>
      <div v-if="!username">
        <el-menu-item index="5" @click="register" style="float: right;">注册</el-menu-item>
        <el-menu-item index="6" @click="login" style="float: right;">登录</el-menu-item>
      </div>
      <div v-if="username">
        <el-submenu index="6" style="float: right;" class="el-icon-user-solid">
          <template slot="title">{{ username }}</template>
          <el-menu-item index="2-1" @click="goPersonalCenter">个人中心</el-menu-item>
          <el-menu-item index="2-2" @click="goAdmin" v-if="user_group === '管理员'">后台管理</el-menu-item>
          <el-menu-item index="2-3" @click="logout(token)">退出</el-menu-item>
        </el-submenu>
      </div>
    </el-menu>
  </div>
</template>
<script>
import axios from 'axios';
export default {
  data() {
    return {
      user_group: '',
      activeIndex: '1',
      username: window.localStorage.getItem("username"),
      token: window.localStorage.getItem("token"),
    };
  },
  methods: {
    goAdmin() {
      window.open("http://127.0.0.1:8081/");
    },
    goPersonalCenter() {
      this.$router.push({ path: '/personal_center' }, () => { }, () => { });
    },
    goHome() {
      this.$router.push({ path: '/' }, () => { }, () => { });
    },
    goInformation() {
      this.$router.push({ path: '/information/list' }, () => { }, () => { });
    },
    goNotice() {
      this.$router.push({ path: '/notice/list' }, () => { }, () => { });
    },
    search() {
      this.$router.push({ path: '/job_recruitment/list' }, () => { }, () => { });
    },
    login() {
      this.$router.push({ path: '/login' }, () => { }, () => { });
    },
    logout(token) {
      let that = this;
      this.$store.commit('logout');
      this.$store.commit('removeToken');
      window.localStorage.removeItem("user_id");
      window.localStorage.removeItem("user_group");
      window.localStorage.removeItem("resume_management_id");
      window.localStorage.removeItem("enterprise_number");
      window.localStorage.removeItem("deliver_resume_id");
      window.localStorage.removeItem("comment_id");
      axios.delete('http://127.0.0.1:5000/api/access_token/del', {
        params: {
          token: token
        }
      })
        .then(function (response) {
          that.$router.push({ name: 'login', params: { isLogout: true } }, () => { }, () => { });
        })
        .catch(function (error) {
          console.log(error);
        })
        .then(function () {
          // 总是会执行
        });
    },
    register() {
      this.$router.push({ path: '/register' }, () => { }, () => { });
    },
    handleSelect(key, keyPath) {

    }
  },
  created: function () {
    let that = this;
    axios.get('http://127.0.0.1:5000/api/user/get_obj', {
      params: {
        username: that.username
      }
    })
      .then(function (response) {
        console.log(response.data);
        window.localStorage.setItem("user_id", response.data.result.obj.user_id);
        window.localStorage.setItem("user_group", response.data.result.obj.user_group);
        that.user_group = response.data.result.obj.user_group;
      })
      .catch(function (error) {
        console.log(error);
      })
      .then(function () {
        // 总是会执行
      });
  },
}

</script>
<style lang="less" scoped>
.topNav {
  width: 100%;
  justify-content: space-around;
  align-items: center;
  flex: auto;
}
</style>